<button
  type="button"
  class="btn d-flex align-items-center py-2 px-3 gap-3 text-truncate w-100"
  [class.active]="name === currentName"
  [class]="[useCreateArticleIcon ? 'btn-primary' : 'btn-secondary']"
  (click)="onClick()"
>
  <div>
    @if (useCreateArticleIcon) {
      <i
        class="bi fs-4"
        [class]="[name === currentName ? 'bi-pen-fill' : 'bi-pen']"
      ></i>
    } @else {
      <i
        class="bi fs-4"
        [class]="[name === currentName ? 'bi-tags-fill' : 'bi-tags']"
      ></i>
    }
  </div>
  <div>{{ name }}</div>
</button>
